<template>
  <div class="container-purchase">
    <template v-if="isFlow">
      <!-- purchase物资采购 -->
      <van-nav-bar title="物资采购" @click-left="goBack" fixed :border="true" :z-index="100" class="my-nav-bar">
        <span class="el-icon-arrow-left fontsize" slot="left"></span>
      </van-nav-bar>
      <div class="container_purchase_header">
        <div class="container_purchase_header_type">
          <span>类型：</span>
          <van-radio-group v-model="radioType" class="my-radio-group" @change="changeType">
            <van-radio name="1" class="my-radio">按进度</van-radio>
            <van-radio name="2" v-if="listtype!==0 && listtype!==1 && listtype!==2" class="my-radio">按模型构件</van-radio>
            <!--  -->
            <van-radio
              name="3"
              class="my-radio"
              v-if="listtype!==0 && listtype!==3"
            >按清单</van-radio>
          </van-radio-group>
        </div>
        <div v-if="radioType==1" class="container_purchase_header_check">
          <span>审核类型：</span>
          <van-radio-group v-model="subs.IsApprove" class="my-radio-group">
            <van-radio name="1" class="my-radio">审核</van-radio>
            <van-radio name="2" class="my-radio">无需审核</van-radio>
          </van-radio-group>
        </div>
      </div>

      <div class="container_purchase_body_select">
        <!-- v-if="radioType==1 || radioType==2" -->
        <div v-if="radioType==1"  class="container_purchase_list_class container_purchase_border">
          <div>楼栋</div>
          <div @click="getBuildingNumber">
            {{options.buildname}}
            <van-icon name="arrow" class="container_purchase_list_span"/>
          </div>
        </div>

        <!-- 按模型构件 -->
        <div v-if="radioType==2"  class="container_purchase_list_class container_purchase_border">
          <div>楼栋：</div>
          <div @click.stop="elementParamsState.showSelectBuild = true">
            {{elementParams.buildname?elementParams.buildname:'请选择楼栋'}}
            <van-icon name="arrow" class="container_purchase_list_span"/>
          </div>
            <van-actionsheet v-model="elementParamsState.showSelectBuild" :actions="BuildNameList" @select="onSelect2" />
        </div>
        <div v-if="radioType==2"  class="container_purchase_list_class container_purchase_border">
          <div>专业：</div>
          <div @click="onClickSpecialty">
            {{elementParams.specialty?elementParams.specialty:'请选择专业'}}
            <van-icon name="arrow" class="container_purchase_list_span"/>
          </div>
          <van-actionsheet v-model="elementParamsState.showSelectSpecialty" :actions="elementSpecialtyList" @select="onSelectSpecialty" />
        </div>
        <div v-if="radioType==2"  class="container_purchase_list_class container_purchase_border">
          <div>楼层：</div>
          <div @click="onClickFloor">
            {{elementParams.floor?elementParams.floor:'请选择楼层'}}
            <van-icon name="arrow" class="container_purchase_list_span"/>
          </div>
          <van-actionsheet v-model="elementParamsState.showSelectFloor" :actions="elementFloorList" @select="onSelectFloor" />
        </div>
        <div v-if="radioType==2"  class="container_purchase_list_class container_purchase_border">
          <div>构件名称：</div>
          <div @click="onClickEl">
            {{elementParams.element?elementParams.element:'请选择构件名称'}}
            <van-icon name="arrow" class="container_purchase_list_span"/>
          </div>
          <van-actionsheet v-model="elementParamsState.showSelectEl" :actions="elementElList" @select="onSelectEl" />
        </div>



        <div v-if="radioType==1" class="container_purchase_list container_purchase_border">
          <div>开始时间：</div>
          <div @click="beginTimeSelect">
            {{options.starttime}}
            <van-icon name="arrow" class="container_purchase_list_span"/>
          </div>
        </div>
        <div v-if="radioType==1" class="container_purchase_list">
          <div>结束时间：</div>
          <div @click="lastTimeSelect">
            {{options.endtime}}
            <van-icon name="arrow" class="container_purchase_list_span"/>
          </div>
        </div>
        <div v-if="radioType==3" class="container_purchase_list container_purchase_border">
          <div>项目名称：</div>
          <div @click="projectNameSelect">
            {{options.projectname}}
            <van-icon name="arrow" class="container_purchase_list_span"/>
          </div>
        </div>
        <div v-if="radioType==3" @click="addProjectName" class="container_purchase_add_list">
          <img src="../../../assets/imgs/add_purchase.png" alt>添加项目名称
        </div>
      </div>
      <div class="container_purchase_hidden">
        <!-- style="width:100%;font-size:28px;box-sizing:border-box;" -->
        <el-table
          :data="buyThingTable"
          :header-cell-style="{'background-color':'#5A92FF','color':'#ffffff'}"
          class="my-table"
        >
          <!-- <el-table-column width="50" align="center" label="操作">
            <template slot-scope="scope">
              <el-checkbox
                class="my-checkbox"
                size="medium"
                v-model="buyThingTable[scope.$index].isSel"
              ></el-checkbox>
            </template>
          </el-table-column>
          <el-table-column prop="TaskName" label="任务名称" align="center"></el-table-column> -->
          <el-table-column prop="ResourceName" label="物资名称" align="center">
            <template slot-scope="scope">
              {{scope.row.ResourceName}} {{scope.row.Spec}}
            </template>
          </el-table-column>
          <el-table-column prop="" label="施工预算量" align="center">
            <template slot-scope="scope">
              {{Number(scope.row.AdjustBOQ).toFixed(2)}}{{scope.row.Unit}}
            </template>
          </el-table-column>
          <el-table-column prop="" label="已采购" align="center">
            <template slot-scope="scope">
              {{Number(scope.row.PurchaseNum).toFixed(2)}}{{scope.row.Unit}}
            </template>
          </el-table-column>
          <el-table-column label="本次采购" align="center">
            <template slot-scope="scope">
              <input
                type="number"
                :placeholder="buyThingTable[scope.$index].Unit"
                v-model="buyThingTable[scope.$index].ThisPurchaseNum"
                name="num"
                class="table_input"
              >
            </template>
          </el-table-column>
        </el-table>
        <!-- <el-pagination
          :total="totalNum"
          @current-change="curChange"
          :page-size="paging.rows"
          :current-page.sync="paging.page"
          background
          layout="prev, pager, next"
          class="my-pagination"
        ></el-pagination> -->
      </div>
      <div class="purchase_addTime">
        <div>需用时间：</div>
        <div @click="witeTime">
          {{subs.DemandTime}}
          <van-icon name="arrow" class="container_purchase_list_span"/>
        </div>
      </div>
      <div class="project-title flex-between">
        工作流程
        <h3 v-if="done" class="project-title-r" @click="isFlow=false">重置</h3>
      </div>
      <div class="flow-content" v-if="done">
        <div class="flow-content-item flex" v-for="(item,index) in listFlow" :key="index">
          <div class="flow-content-item-l flex-row">
            {{index+1}}
            <div class="line" v-if="index !== listFlow.length-1"></div>
          </div>

          <div class="flow-content-item-c flex">
            <div
              class="flow-content-item-c-l flex-row"
            >{{item.Person.name}}</div>
            <div class="flow-content-item-c-l flex-row flow-content-item-border">{{item.OrgId.name}}</div>
            <div class="flow-content-item-c-l flex-row">{{item.DepId.name}}</div>
            <div class="flow-content-item-c-triangle">
              <div class="flow-content-item-c-triangle-b"></div>
            </div>
          </div>

          <!-- <div class="flow-content-item-r" @click="onDelete(index)">
          <img src="../../user/user_assets/imgs/delete.png">
          </div>-->
        </div>
      </div>
      <div class="flow-work flex" v-else>
        <div class="flow-work-c flex-column-center-b" @click="isFlow=false">
          <img src="../../user/user_assets/imgs/add.png">
          新增
        </div>
      </div>

      <div class="purchase_btn">
        <button class="purchase_button" @click="searchAllTable()">确认提交</button>
      </div>

      <!-- 上拉菜单--每次点击事件-传入可以选择的值-然后再把值传入 -->
      <van-actionsheet v-model="showSelect" :actions="actions" item-height="60" @select="onSelect"/>
      <!-- 时间选择 -->
      <van-popup v-model="timeShow" position="bottom">
        <van-datetime-picker
          v-model="currentDate"
          @confirm="closeTime"
          @cancel="cancel"
          :formatter="formatter"
          type="date"
          class="my-picker"
        />
      </van-popup>
    </template>
    <template v-else>
      <flowComp @onDone="onDone" :origin="1"></flowComp>
    </template>
  </div>
</template>

<script type='textecmascript-6'>
import flowComp from "../../user/addFlow";
import {GetSpecialtybyBuilding,GetFloorbyBuilding,QueryAllElementCateNameByInfo,QueryPurchaseInfoAPP} from '@/api/api.js'

import {
  getListType,
  getBuildList,
  getPurchaseInfo,
  sponsorPurchase,
  getProjectNames
} from "../../../assets/js/scopeManage.js";

export default {
  components: { flowComp },
  data() {
    return {
      radioType: "1", //类型
      radioCheck: "1", //审核类型
      getNumber: "请选择采购批次",
      showNumber: false, //数字输入框
      showSelect: false, //上拉菜单--显示隐藏
      actions: [], //上拉菜单--数组集合
      selectNumber: 1, //为1的时候是批次，为2的时候是楼栋
      getBuilding: "请选择楼栋",
      timeShow: false, //时间选择
      timenumber: 1, //为1的时候是开始时间，为2的时候是结束时间，为3的时候为需要时间
      beginTime: "请选择开始时间",
      lastTime: "请选择结束时间",
      buyThing: "请选择采购列表",
      currentDate: new Date(),
      wantTime: "请选择需求时间",
      projectName: "项目名称",
      projectNumber: "项目编码",

      projectid: localStorage.getItem("projectid"),
      userID: localStorage.getItem("userId"), //用户ID
      listtype: 0, // 0为未导入 1为施工图清单 2.全费用清单 3.构件生成清单
      labelText: "", // 资源名称 项目名称
      BuildNameList: [], // 楼栋下拉
      totalNum: 0,
      paging: { page: 1, rows: 5 }, // [采购列表分页]
      done: false,
      isFlow: true,
      projectNameList: [],
      elementSpecialtyList:[],//按模型构件 专业下拉菜单
      elementFloorList:[],//按模型构件 楼层下拉菜单
      elementElList:[],//按模型构件 构件名称下拉菜单
      elementParamsState:{//按模型构件的参数 下拉菜单显示
        showSelectBuild:false,//楼栋
        showSelectSpecialty:false,//专业
        showSelectFloor:false,//楼层
        showSelectEl:false,//构件名称
      },
      elementParams:{//按模型构件的参数
        buildname:'',//已选择的楼栋
        specialty:'',//已选择的专业
        floor:'',//已选择的楼层
        element:'',//已选择的构件
      },

      options: {
        // 获取table 参数
        buildname: "请选择楼栋",
        starttime: "请选择开始时间",
        endtime: "请选择结束时间",
        projectid: "",
        querytype: "",
        listtype: "",
        projectname: "请选择项目名称",
        elementids: "",
        page: "", // 第几也页
        rows: "" // 每页行数
      },
      subs: {
        IsApprove: "1",
        DemandTime: "请选择需求时间"
      },
      buyThingTable: [], // table
      listFlow: [], // 工作流列表
      schedule: {
        list: [],
        querytype: "1",
        listItems: [],
        page: 1,
        rows: 5
      }, // 进度

      mode: {
        list: [],
        querytype: "2",
        page: 1,
        rows: 5
      }, // 模型

      bill: {
        list: [],
        querytype: "3",
        page: 1,
        rows: 5
      } // 清单
    };
  },
  created() {
    // 获取清单类型
    getListType(this);
    // 获取项目名称
    getProjectNames(this, res => {
      this.projectNameList = res.map(item => {
        return {
          name: item.text,
          id: item.id
        };
      });
    });
    // 获取楼栋
    getBuildList(this, res => {
      this.BuildNameList = res.map(item => {
        return {
          name: item.text,
          id: item.id
        };
      });
      this.BuildNameList.splice(0, 1);
    });
  },
  methods: {
    onDone(d) {
      this.done = true;
      this.isFlow = true;
      this.listFlow = d;
    },
    //选择类型
    changeType(val){
      console.log(val)
      this.paging.page = 1
      this.totalNum = 0
    },
    // 分页
    curChange(d) {
      this.paging.page = d;
      let radioType = this.radioType;
      if (radioType == 1) {
        this.schedule.page = d;
        let ls = this.buyThingTable.filter(res => {
          return res.ThisPurchaseNum !== "";
        });
        this.schedule.listItems = this.arrHandle(this.schedule.listItems, ls);
      } else if (radioType == 2) {
        this.mode.page = d;
      } else if (radioType == 3) {
        this.bill.page = d;
      }
      this.getTableDate();
    },
    // 获取筛选的表格内容
    getTableDate() {
      let radioType = this.radioType;
      let flag = false;
      if (radioType == 1) {
        if (
          this.options.buildname !== "请选择楼栋" &&
          this.options.starttime !== "请选择开始时间" &&
          this.options.endtime !== "请选择结束时间"
        ) {
          flag = true;
        } else {
          flag = false;
        }
        // if (this.schedule.list.length > 0) {
        // }
      } 
      // else if (radioType == 2) {
      // } 
      else if (radioType == 3) {
        if (
          this.options.buildname !== "请选择楼栋" &&
          this.options.projectname !== "请选择项目名称"
        ) {
          flag = true;
        } else {
          flag = false;
        }
      }

      if (!flag) return;
      this.buyThingTable = [];
      let par = {};
      par.projectid = this.projectid;
      par.listtype = this.listtype;

      if (radioType == 1) {
        par.querytype = this.schedule.querytype;
        par.buildname = this.options.buildname;
        par.starttime = this.options.starttime;
        par.endtime = this.options.endtime;
        par.page = this.schedule.page;
        par.rows = this.paging.rows;
      }
      if (radioType == 3) {
        par.querytype = this.bill.querytype;
        par.buildname = this.options.buildname;
        par.projectname = this.options.projectname;
        par.page = this.bill.page;
        par.rows = this.paging.rows;
      }
      // console.log(par, this.options, radioType);
      getPurchaseInfo(this, par, res => {
        let data = res.Detiel.map(item => {
          return Object.assign(item, {
            ThisPurchaseNum: "",
            Floor: this.options.buildname,
            ProjectID: this.projectid,
            isSel: false
          });
        });
        this.totalNum = Number(res.Count);
        console.log(data)
        data.forEach(i=>{
          i.ThisPurchaseNum = Number(i.AdjustBOQ).toFixed(2)
        })
        if (radioType == 1) {
          this.schedule.list = data;
          this.buyThingTable = this.schedule.list;
        } else if (radioType == 2) {
          this.mode.list = data;
          this.buyThingTable = this.mode.list;
        } else if (radioType == 3) {
          this.bill.list = data;
          this.buyThingTable = this.bill.list;
        }
      });
    },
    //点击上拉菜单的确定的时候
    onSelect(item) {
      if (this.selectNumber == 1) {
        this.getNumber = item.name; //采购批次
      } else if (this.selectNumber == 2) {
        this.options.buildname = item.name; //楼栋
      } else if (this.selectNumber == 3) {
        this.buyThing = item.name; //采购列表
      } else if (this.selectNumber == 4) {
        this.projectNumber = item.name; //项目编码
      } else if (this.selectNumber == 5) {
        this.options.projectname = item.name; //项目名称
        console.log(this.options.projectname);
      }
      this.showSelect = false;
    },
    //选择楼栋
    getBuildingNumber() {
      this.showSelect = true;
      this.selectNumber = 2;
      this.actions = this.BuildNameList;
    },
    /**
     * 按模型构件获取楼栋
     */
    // selectBuild(){
    //   this.elementParamsState.showSelectBuild = true
    // },
    // 点击遮罩层时触发
    clickOverlay(){
      this.elementParamsState.showSelectBuild = false
    },
    /**
     * 点击专业下拉时
     */
    onClickSpecialty(){
      if(!this.elementParams.buildname){
        this.$message({type:'warning',message:'请先选择楼栋',center:'true'})
        return
      }
      this.elementParamsState.showSelectSpecialty=true 
    },
    /**
     * 点击楼层下拉时
     */
    onClickFloor(){
      if(!this.elementParams.buildname){
        this.$message({type:'warning',message:'请先选择楼栋',center:'true'})
        return
      }
      if(!this.elementParams.specialty){
        this.$message({type:'warning',message:'请先选择专业',center:'true'})
        return
      }
      this.elementParamsState.showSelectFloor = true
    },
    /**
     * 点击构件名称下拉时
     */
    onClickEl(){
      if(!this.elementParams.buildname){
        this.$message({type:'warning',message:'请先选择楼栋',center:'true'})
        return
      }
      if(!this.elementParams.specialty){
        this.$message({type:'warning',message:'请先选择专业',center:'true'})
        return
      }
      if(!this.elementParams.floor){
        this.$message({type:'warning',message:'请先选择楼层',center:'true'})
        return
      }
      this.elementParamsState.showSelectEl = true
    },
    /**
     * 选择楼栋
     */
    onSelect2(item,index){
      console.log(item,index)
      this.elementParams.buildname = item.name
      this.elementParams.specialty = ''
      this.elementParams.floor = ''
      this.elementParams.element = ''
      this.elementParamsState.showSelectBuild = false
      this.queryPurchaseInfoAPP(item.name,this.elementParams.specialty,this.elementParams.floor,this.elementParams.element)
      //根据楼栋获取专业
      this.Request(GetSpecialtybyBuilding({projectid:localStorage.getItem ('projectid'),building:item.name})).then(res=>{
        console.log(res)
        if(res.StatusCode === 200){
          res.Detiel.forEach(i => {
            i.name = i.text
          });
          this.elementSpecialtyList = res.Detiel
          console.log(this.elementSpecialtyList)
        }
      })
      
    },
    /**选择专业 */
    onSelectSpecialty(item){
      console.log(item)
      
      this.elementParams.specialty = item.name
      this.elementParams.floor = ''
      this.elementParams.element = ''
      this.elementParamsState.showSelectSpecialty = false
      this.queryPurchaseInfoAPP(this.elementParams.buildname,this.elementParams.specialty,this.elementParams.floor,this.elementParams.element)
      //根据楼栋,专业获取楼层
      this.Request(GetFloorbyBuilding({projectid:localStorage.getItem ('projectid'),building:this.elementParams.buildname,Specialty:item.name})).then(res=>{
        console.log(res)
        if(res.StatusCode === 200){
          res.Detiel.forEach(i => {
            i.name = i.text
          });
          this.elementFloorList = res.Detiel
          console.log(this.elementFloorList)
        }
      })
    },
    /**
     * 选择楼层
     */
    onSelectFloor(item){
      this.elementParams.floor = item.name
      this.elementParams.element = ''
      this.elementParamsState.showSelectFloor = false
      this.queryPurchaseInfoAPP(this.elementParams.buildname,this.elementParams.specialty,this.elementParams.floor,this.elementParams.element)
      this.loadding()
      this.Request(QueryAllElementCateNameByInfo({ProjectID:localStorage.getItem ('projectid'),BuildName:this.elementParams.buildname,
      Specialty:this.elementParams.specialty,Floor:item.name})).then(res=>{
        console.log(res)
        if(res.StatusCode === 200){
          res.Detiel.forEach(i => {
            i.name = i.code
          });
          this.elementElList = res.Detiel
          console.log(this.elementElList)
        }
        this.$toast.clear()
      })
    },
    /**
     * 选择构件名称
     */
    onSelectEl(item){
      this.elementParams.element = item.name
      this.elementParamsState.showSelectEl = false
      this.queryPurchaseInfoAPP(this.elementParams.buildname,this.elementParams.specialty,this.elementParams.floor,this.elementParams.element)
    },
    
    /**
     * 按模型构件 获取表数据
     */
    queryPurchaseInfoAPP(buildname,specialty,floor,familytypename){
      this.Request(QueryPurchaseInfoAPP({
        buildname,
        querytype:2,
        projectid:localStorage.getItem('projectid'),
        specialty,
        floor,
        familytypename
      })).then(res=>{
        console.log(res)
        if(res.StatusCode==200){
          res.Detiel.forEach(i=>{
            i.ThisPurchaseNum = Number(i.AdjustBOQ).toFixed(2)
          })
          this.buyThingTable = res.Detiel
        }
      })
    },

    beginTimeSelect() {
      this.timeShow = true;
      this.timenumber = 1;
    },
    lastTimeSelect() {
      this.timeShow = true;
      this.timenumber = 2;
    },
    //时间上拉菜单上的--确定
    closeTime(value) {
      if (this.timenumber == "1") {
        this.options.starttime =
          value.getFullYear() +
          "/" +
          (value.getMonth() + 1) +
          "/" +
          value.getDate();
      } else if (this.timenumber == "2") {
        this.options.endtime =
          value.getFullYear() +
          "/" +
          (value.getMonth() + 1) +
          "/" +
          value.getDate();
      } else if (this.timenumber == "3") {
        this.subs.DemandTime =
          value.getFullYear() +
          "/" +
          (value.getMonth() + 1) +
          "/" +
          value.getDate();
      }
      this.timeShow = false;
    },
    //时间上拉菜单上的--取消
    cancel() {
      this.timeShow = false;
    },
    formatter(type, value) {
      if (type === "year") {
        return `${value}年`;
      } else if (type === "month") {
        return `${value}月`;
      } else if (type === "day") {
        return `${value}日`;
      }
      return value;
    },
    //需要时间
    witeTime() {
      this.timeShow = true;
      this.timenumber = 3;
    },
    //项目编码选择
    projectSelect() {
      this.showSelect = true;
      this.selectNumber = 4;
      this.actions = [
        { value: "1", name: "项目编码01" },
        { value: "2", name: "项目编码02" },
        { value: "3", name: "项目编码03" },
        { value: "4", name: "项目编码04" },
        { value: "5", name: "项目编码05" }
      ];
    },
    //项目名称选择
    projectNameSelect() {
      console.log(this.projectNameList)
      this.showSelect = true;
      this.selectNumber = 5;
      this.actions = this.projectNameList;
    },
    //点击添加--项目名称
    addProjectName() {
      this.getTableDate();
    },





    //点击确认提交按钮
    searchAllTable() {
      // this.$router.push({ path: "./modules/purchaseTable" });
      let radioType = this.radioType;
      // let flag = false;
      let listItems = [];
      if (!this.isJudge()) return;
      // if (radioType == 1) {
      //   let ls = this.buyThingTable.filter(res => {
      //     return res.ThisPurchaseNum !== "";
      //   });
      //   listItems = this.arrHandle(this.schedule.listItems, ls);
      // }else{
      //   listItems = this.buyThingTable
      // }
      this.buyThingTable.forEach(i=>{
        i.ResourseName = i.ResourceName
      })
      listItems = this.buyThingTable
      //  else if (radioType == 2) {
      // }
      //  else if (radioType == 3) {
      // }

      if (this.subs.IsApprove == '1' && this.listFlow.length == 0) {
        this.$message({
          type: "warning",
          message: "工作流程不能为空！"
        });
        return;
      }
      let listFlow = this.listFlow.map(item => {
        return {
          Priority: item.Priority,
          OrgId: item.OrgId.id?item.OrgId.id:0,
          DepId: item.DepId.id?item.DepId.id:0,
          Person: item.Person.id?item.Person.id:0,
          Status: item.Status
        };
      });

      let par = {};
      if (radioType == 1) {
        par.IsApprove = this.subs.IsApprove;
        par.Type = radioType;
        par.StartTime = this.options.starttime;
        par.EndTime = this.options.endtime;
        par.DemandTime = this.subs.DemandTime;
        par.ApplyPerson = this.userID;
        par.Status = 0;
        par.listFlow = listFlow;
        par.listItems = listItems;
      }else{
        par.IsApprove = this.subs.IsApprove;
        par.Type = radioType;
        // par.StartTime = this.options.starttime;
        // par.EndTime = this.options.endtime;
        par.DemandTime = this.subs.DemandTime;
        par.ApplyPerson = this.userID;
        par.Status = 0;
        par.listFlow = listFlow;
        par.listItems = listItems;
      }
      console.log(par, this.subs, radioType);
      sponsorPurchase(
        this,
        { projectid: this.projectid, userid: this.userID },
        par
      );
    },





    goBack() {
      this.$router.push({ path: "/#" });
    },
    arrHandle(arr1, arr2) {
      var arr = arr1.concat();
      for (var i = 0; i < arr2.length; i++) {
        arr.indexOf(arr2[i]) === -1 ? arr.push(arr2[i]) : 0;
      }
      return arr;
    },
    isJudge() {
      if (this.radioType == 1 && this.options.buildname == "请选择楼栋") {
        this.$message({
          type: "warning",
          message: "请选择楼栋",
          center: "true"
        });
        return false;
      }
      // if (this.radioType == 2 && this.elementParams.buildname == "请选择楼栋") {
      //   this.$message({
      //     type: "warning",
      //     message: "请选择楼栋",
      //     center: "true"
      //   });
      //   return false;
      // }
      if (this.radioType == 2 && this.buyThingTable.length == 0) {
        this.$message({
          type: "warning",
          message: "无构件数据",
          center: "true"
        });
        return false;
      }
      if (this.radioType == 1 && this.options.starttime == "请选择开始时间") {
        this.$message({
          type: "warning",
          message: "请选择开始时间",
          center: "true"
        });
        return false;
      }
      if (this.radioType == 1 && this.options.endtime == "请选择结束时间") {
        this.$message({
          type: "warning",
          message: "请选择结束时间",
          center: "true"
        });
        return false;
      }
      if (this.subs.IsApprove == '1' && this.radioType == 1 && this.listFlow.length < 4) {
        this.$message({
          type: "warning",
          message: "该流程为4个人",
          center: "true"
        });
        return false;
      }
      if (this.subs.DemandTime == "请选择需求时间") {
        this.$message({
          type: "warning",
          message: "请选择需求时间",
          center: "true"
        });
        return false;
      }
      if (this.radioType == 3 && this.options.projectname == "请选择项目名称") {
        this.$message({
          type: "warning",
          message: "请选择需求时间",
          center: "true"
        });
        return false;
      }
      return true;
    }
  },
  watch: {
    // radioType
    radioType() {
      this.options = {
        // 获取table 参数
        buildname: "请选择楼栋",
        starttime: "请选择开始时间",
        endtime: "请选择结束时间",
        projectid: "",
        querytype: "",
        listtype: "",
        projectname: "请选择项目名称",
        elementids: "",
        page: "", // 第几也页
        rows: "" // 每页行数
      };
      this.subs.DemandTime = "请选择需求时间";
      this.buyThingTable = [];
    },
    // table 参数
    options: {
      handler(val) {
        if (this.radioType == 1) {
          this.getTableDate();
        }
        if (val.buildname != "请选择楼栋" && this.radioType == 3) {
          this.projectNameList = [];
          getProjectNames(this, res => {
            this.projectNameList = res.map(item => {
              return {
                name: item.text,
                id: item.id
              };
            });
          });
        }
      },
      deep: true
    }
  }
};
</script>
<style lang='stylus' scoped rel='stylesheet/stylus'>
.container-purchase .van-actionsheet__item {
  line-height: 80px !important;
  height: 80px !important;
}

.container-purchase .pagina {
  text-align: center;
  margin-top: 10px;
}

.container-purchase {
  width: 100%;
  min-height: calc(100vh - 88px) !important;
  background-color: #F6F8FA;
  font-size: 30px;

  .flex {
    display: flex;
    align-items: center;
  }

  .flex-row {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .flex-between {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  .project-title {
    font-size: 28px;
    font-family: SourceHanSansCN-Medium;
    font-weight: 500;
    color: rgba(51, 51, 51, 1);
    height: 1.18rem;
    margin: 0 0.32rem;
  }

  .flow-work {
    font-size: 26px;
    font-family: SourceHanSansCN-Regular;
    font-weight: 400;
    color: rgba(153, 153, 153, 1);
    height: 2.13rem;
    background: rgba(255, 255, 255, 1);
    padding: 0 0.32rem;

    img {
      width: 0.8rem;
      height: 0.76rem;
      display: block;
      margin-bottom: 0.16rem;
    }
  }

  .project-title-r {
    height: 1.18rem;
    font-size: 28px;
    font-family: SourceHanSansCN-Regular;
    font-weight: 400;
    color: rgba(90, 146, 255, 1);
    line-height: 1.18rem;
  }

  .flow-content {
    padding: 0 0.32rem;
    background: rgba(246, 248, 250, 1);

    .flow-content-item {
      margin-top: 0.4rem;

      .flow-content-item-l {
        width: 0.53rem;
        height: 0.53rem;
        border-radius: 50%;
        background: rgba(59, 72, 95, 1);
        font-size: 28px;
        font-family: SourceHanSansCN-Medium;
        font-weight: 500;
        color: rgba(255, 255, 255, 1);
        position: relative;
        margin-right: 0.55rem;

        .line {
          position: absolute;
          top: 0.64rem;
          left: 0.23rem;
          width: 0.05rem;
          height: 0.83rem;
          background-color: #979797;
        }
      }

      .flow-content-item-c {
        flex: 1;
        font-size: 28px;
        font-family: SourceHanSansCN-Medium;
        font-weight: 500;
        color: rgba(51, 51, 51, 1);
        background: rgba(255, 255, 255, 1);
        box-shadow: 0px 0.0133rem 0.11rem 0px rgba(220, 226, 237, 1);
        border-radius: 0.0532rem;
        height: 1.18rem;
        position: relative;

        .flow-content-item-c-triangle {
          top: 0;
          left: -0.3rem;
          position: absolute;
          height: 1.18rem;
          width: 0.3rem;
          overflow: hidden;

          .flow-content-item-c-triangle-b {
            position: absolute;
            transform: rotate(45deg) !important;
            -ms-transform: rotate(45deg) !important;
            -moz-transform: rotate(45deg) !important;
            -webkit-transform: rotate(45deg) !important;
            -o-transform: rotate(45deg) !important;
            background: rgba(255, 255, 255, 1);
            box-shadow: 0px 0.0133rem 0.11rem 0px rgba(220, 226, 237, 1);
            height: 0.4rem;
            width: 0.4rem;
            top: 0.39rem;
            left: 0.15rem;
          }
        }

        .flow-content-item-c-l {
          flex: .3;
        }

        .flow-content-item-border {
          border-right: 0.03rem dashed #979797;
          border-left: 0.03rem dashed #979797;
          padding:0 10px;
          flex:1
        }
      }

      .flow-content-item-r {
        margin-left: 0.56rem;
        img {
          width: 0.46rem;
          height: 0.46rem;
          display: block;
        }
      }
    }
  }

  // 头部单选
  .container_purchase_header {
    width: 100%;
    margin-top: 88px;
  }

  .container_purchase_header_type {
    height: 88px;
    line-height: 88px;
    border-bottom: 2px solid #EDEDED;
    box-sizing: border-box;
    background-color: #ffffff;
    padding: 0px 20px;
  }

  .container_purchase_header_type>span {
    display: inline-block;
    float: left;
    width: 15%;
  }

  .container_purchase_header_check {
    height: 88px;
    line-height: 88px;
    box-sizing: border-box;
    background-color: #ffffff;
    padding: 0px 20px;
  }

  .container_purchase_header_check>span {
    display: inline-block;
    float: left;
    width: 22%;
  }

  // 下拉菜单
  .container_purchase_body_select {
    width: 100%;
    margin-top: 20px;
  }

  .container_purchase_list {
    height: 88px;
    line-height: 88px;
    font-size: 30px;
    box-sizing: border-box;
    background-color: #ffffff;
    padding: 0px 20px;
  }

  .container_purchase_border {
    border-bottom: 2px solid #EDEDED;
  }

  .container_purchase_list>div:first-child {
    width: 24%;
    display: inline-block;
    float: left;
  }

  .container_purchase_list>div:last-child {
    width: 76%;
    display: inline-block;
    float: left;
    padding-left: 20px;
    box-sizing: border-box;
    color: #A7A7A7;
  }

  .container_purchase_list_class {
    height: 88px;
    line-height: 88px;
    font-size: 30px;
    padding: 0px 20px;
    box-sizing: border-box;
    background-color: #ffffff;
  }

  .container_purchase_list_class>div:first-child {
    width: 24%;
    display: inline-block;
    float: left;
  }

  .container_purchase_list_class>div:last-child {
    width: 76%;
    display: inline-block;
    float: left;
    color: #A7A7A7;
  }

  .container_purchase_list_span {
    float: right;
    margin-right: 20px;
    line-height: 88px;
  }

  .container_purchase_table_select {
    width: 70%;
    box-sizing: border-box;
    background-color: #F6F8FA;
    padding: 0px 20px;
    height: 90px;
    line-height: 90px;
  }

  .container_purchase_table_select>div:first-child {
    width: 40%;
    display: inline-block;
    float: left;
  }

  .container_purchase_table_select>div:last-child {
    width: 50%;
    display: inline-block;
    float: left;
    color: #A7A7A7;
  }

  .container_purchase_hidden {
    width: 100%;
    overflow: hidden;
    // height: 400px;
    box-sizing: border-box;
  }

  .purchase_addTime {
    margin-top: 20px;
    width: 100%;
    height: 88px;
    line-height: 88px;
    font-size: 30px;
    padding: 0px 20px;
    box-sizing: border-box;
    background-color: #ffffff;
  }

  .purchase_addTime>div:first-child {
    width: 24%;
    display: inline-block;
    float: left;
  }

  .purchase_addTime>div:last-child {
    width: 76%;
    display: inline-block;
    float: left;
    color: #A7A7A7;
    // 工作流程
  }

  .purchase_btn {
    text-align: center;
    padding: 0 20px;
    padding-bottom: 40px;
    margin-top: 30px;
    background-color: #F6F8FA;
    // 按钮
  }

  .purchase_button {
    background: rgba(100, 155, 255, 1);
    box-shadow: 0px 3px 7px 0px rgba(91, 140, 237, 0.13);
    border-radius: 8px;
    font-size: 28px;
    width: 100%;
    height: 88px;
    font-family: PingFang-SC-Bold;
    font-weight: 500;
    color: rgba(255, 255, 255, 1);
    padding: 17px 0px;
    border: 0;
  }

  .container_purchase_add_list {
    height: 88px;
    line-height: 88px;
    font-size: 30px;
    box-sizing: border-box;
    background-color: #ffffff;
    padding: 0px 20px;
    color: #999999;
  }

  .container_purchase_add_list img {
    height: 40px;
    width: 40px;
    margin-right: 20px;
    position: relative;
    top: 10px;
  }
}
</style>
<style>
@import "~@/assets/css/resetVant.css";
/* .container-purchase .van-picker__toolbar {
  line-height: 60px !important;
  height: 60px !important;
}
.container-purchase .el-table__empty-text {
  font-size: 26px;
} */
/* 顶部表头 */
/* .container-purchase .van-nav-bar .van-nav-bar__title {
  font-size: 36px;
} */

/*.container-purchase .container_purchase_hidden .el-checkbox__inner {
   background-color:rgba(238,238,238,1);
  border-color: rgba(238,238,238,1);
  border: 1px solid #409eff;
  width: 22px;
  height: 22px;
  border-radius: 2px; 
}*/
/*.container-purchase .container_purchase_hidden .is-checked {
   background-color: #409eff;
  border-color: #409eff; 
}*/
/*.container-purchase .container_purchase_hidden .is-indeterminate {
   background-color:rgba(238,238,238,1);
  border-color: rgba(238,238,238,1);
  border: 1px solid #409eff;
  width: 22px;
  height: 22px;
  border-radius: 2px; 
}*/
/* .container-purchase .van-nav-bar {
  height: 88px;
  line-height: 88px;
} */
/* 单选框--样式更改--改为行内块元素 */
.container-purchase .my-radio-group {
    display: flex;
    flex-direction: row;
}
.container-purchase .my-radio {
    margin-right: 40px;
}
.container-purchase .my-pagination{
  text-align: center;
}
/* .container_purchase_header_type .van-radio-group .van-radio {
  display: block;
  float: left;
  width: 33%;
}
.container_purchase_header_type .van-radio-group {
  display: block;
  float: left;
  width: 85%;
}
.container_purchase_header_check .van-radio-group .van-radio {
  display: block;
  float: left;
  width: 50%;
}
.container_purchase_header_check .van-radio-group {
  display: block;
  float: left;
  width: 77%;
} */
/* 表格样式更改 */
.container-purchase .my-pagination.el-pagination{
    margin-top: 30px;
}
.container-purchase .my-table .table_input{
  width:160px;
  height:40px;
  border-radius:4px;
  text-align: center;
  border:1px solid rgba(229,229,229,1);
}
/* .container-purchase .container_purchase_hidden .el-table .cell {
  height: 60px;
  line-height: 60px;
  font-size: 30px;
}
.container-purchase .container_purchase_hidden .el-table .table_input {
  width: 120px;
  height: 60px;
  background: rgba(238, 238, 238, 1);
  border-radius: 8px;
  padding-left: 10px;
  border: 1px solid rgba(229, 229, 229, 1);
} */
.my-table .el-table__body-wrapper{
      height: 500px;
    overflow-y: auto;
overflow-x:hidden
}
</style>
